<template>
  <div @click="toCenter" class="avatar">
    <el-avatar shape="square" :size="40" :fit="'fill'" :src="userImg"></el-avatar>
  </div>
</template>
<script>
import { Avatar } from "element-ui";
export default {
  components: {
    ElAvatar: Avatar
  },
  data() {
    return {
      userImg: ""
    };
  },
  computed: {
    identity() {
      return this.$store.state.login.identity;
    }
  },
  created() {
    if (this.$store.state.login.identity === "T") {
      this.userImg = this.$store.state.teacher.userImg;
    } else if (this.$store.state.login.identity === "S") {
      this.userImg = this.$store.state.student.userImg;
    }
  },
  methods: {
    toCenter() {
      if (this.identity == "T") {
        this.$router.push("/teacher_center_s");
      } else if (this.identity == "S") {
        this.$router.push("/student_center_s");
      } else {
        return;
      }
    }
  }
};
</script>

<style lang="scss" scoped>
.avatar {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
</style>